const {src,dest,parallel,series,watch} = require('gulp')
const del = require('del')
const loadPlugins = require('gulp-load-plugins')
const plugins = loadPlugins()
const imagemin =require('gulp-imagemin')
const browserSync  = require('browser-sync')
const bs = browserSync.create()
const cwd = process.cwd()
let config = {
  build:{
    src:'src',
    dist:'dist',
    temp:'temp',
    public:'public',
    phaus:{
      style:'assets/styles/*.scss',
      scripts:'assets/scripts/*.js',
      pages:'*.html',
      image:'assets/images/**',
      font:'assets/fonts/**',
    }
  }
 
}
try{
  const loadConfig = require(`${cwd}pages.config.js`)
  config = Object.assign({},config,loadConfig)
}catch(err){

}

const clean = () =>{
  return del([config.build.dist,config.build.temp])
}
const style = () =>{
  return src(config.build.phaus.style,{base:config.build.src,cwd:config.build.src})
  .pipe(plugins.sass({outputStyle:'expanded'}))
  .pipe(dest(config.build.temp))
  .pipe(bs.reload({stream:true}))
}
const scripts = () =>{
  return src(config.build.phaus.scripts,{base:config.build.src,cwd:config.build.src})
  .pipe(plugins.babel({
    presets:[require('@babel/preset-env')]
  }))
  .pipe(dest(config.build.temp))
  .pipe(bs.reload({stream:true}))
}
const pages = () =>{
  return src(config.build.phaus.pages,{base:config.build.src,cwd:config.build.src})
  .pipe(plugins.swig({data:config.data}))
  .pipe(dest(config.build.temp))
  .pipe(bs.reload({stream:true}))
}
const image = () =>{
  return src(config.build.phaus.image,{base:config.build.src,cwd:config.build.src})
  .pipe(plugins.imagemin())
  .pipe(dest(config.build.dist))
}
const font = () =>{
  return src(config.build.phaus.font,{base:config.build.src,cwd:config.build.src})
  .pipe(plugins.imagemin())
  .pipe(dest(config.build.dist))
}
const extra = () =>{
  return src(`**`,{base:config.build.public,cwd:config.build.public})
  .pipe(dest(config.build.dist))
}
const useref = () => {
  return src(config.build.phaus.pages, { base: config.build.temp,cwd: config.build.temp })
    .pipe(plugins.useref({ searchPath: [config.build.temp, '.'] }))
    // html js css
    .pipe(plugins.if(/\.js$/, plugins.uglify()))
    .pipe(plugins.if(/\.css$/, plugins.cleanCss()))
    .pipe(plugins.if(/\.html$/, plugins.htmlmin({
      collapseWhitespace: true,
      minifyCSS: true,
      minifyJS: true
    })))
    .pipe(dest(config.build.dist))
}
const server = () =>{
  watch(config.build.phaus.style,{cwd:config.build.src},style)
  watch(config.build.phaus.scripts,{cwd:config.build.src},scripts)
  watch(config.build.phaus.pages,{cwd:config.build.src},pages)
  // watch('src/assets/images/**',image)
  // watch('src/assets/fonts/**',font)
  // watch('public/**',extra)
  watch([
    config.build.phaus.image,
    config.build.phaus.font,
  ],{cwd:config.build.src},bs.reload)
  watch([
    `**`,
  ],{cwd:config.build.public},bs.reload)
  bs.init({
    notify:false,
    open:false,
    port:8001,
   // files:'dist/**',
    server:{
      baseDir:[config.build.temp,config.build.dist,config.build.public],
      routes:{
        '/node_modules':'node_modules'
      }
    }
  })
}
const compile = parallel(style,scripts,pages)
const  build = series(clean,parallel(series(compile,useref) ,extra,image,font)) 
const develop = series(compile,server)
 module.exports = {
  clean,build,develop
 }